<template>
    <div class="userInfo">
        <Ope
            :ifNew="true"
            :ifSearch="true"
            searchFun="searchUser"
            @searchUser="searchUser"
            newFun="refresh"
            @refresh="refresh"
            :allSearchKind="allSearchKind"
        ></Ope>
        <Table
            class="table"
            :tableData="allUser"
            @lookUser="lookUser"
            @delUser="delUser"
        ></Table>
        <Dialog
            ref="dialog"
            @confirmEdit="confirmEdit"
        
        ></Dialog>
        <dialog-add
            ref="dialogAdd"
        ></dialog-add>

        <el-pagination
            @current-change='choosePage'
            style="margin-top: 30px"
            background
            layout="prev, pager, next"
            :total="dataTotal"
            :page-size="dataNum"
            >
        </el-pagination>
    </div>
</template>

<script>
import Ope from 'template/Ope'
import Table from './Table'
import Dialog from './Dialog'
import DialogAdd from './DialogAdd'
import methods from './methods.js'
export default {
    components: {
        Table,
        Ope,
        Dialog,
        DialogAdd
    },
    name: 'UserInfo',
    mounted () {
        this.listenRoute();
    },
    data () {
        return {
            pageSize: 1,
            dataTotal: 100,
            keyName: '',
            keyWord: '',
            page: 1,
            dataNum: 10,
            allUser: [],
            allSearchKind: [{
                label: '用户名',
                value: 'userName'
            }, {
                label: '是否专家',
                value: 'isExpert'
            }, {
                label: '是否被拉黑',
                value: 'isBlack'
            }]

        }
    },
    methods: methods
}
</script>

<style lang="stylus" scoped>
    .userInfo
        width 100%
        height 100%
        .table
            width 100%
            height 80%
            overflow scroll
    

        
</style>

